﻿@{
    var KeyId = Tools.HttpHelper.Request.Query["ID"];

    DBContext db = new DBContext();
    var list = db.FindList<Sys_FunctionM>(null, orderby => new { orderby.Function_Num });
}
<div class="page-content animated fadeInDown">
    <div class="container-fluid" style="margin-bottom:100px;">
        <div class="row" id="form">
            <!--检索面板-->
            <div class="col-sm-6 col-md-4">
                <h4 class="example-title">菜单编号</h4>
                <input class="form-control" type="text" data-bind="value:Menu_Num" placeholder="A 或者 A-100">
            </div>

            <div class="col-sm-6 col-md-4">
                <h4 class="example-title">菜单名称</h4>
                <input class="form-control" type="text" data-bind="value:Menu_Name" placeholder="请输入菜单名称">
            </div>

            <div class="col-sm-6 col-md-4">
                <h4 class="example-title">菜单Href</h4>
                <input class="form-control" type="text" data-bind="value:Menu_Url" placeholder="请输入菜单Href 如：/Admin/User/Index">
            </div>

            <div class="col-sm-6 col-md-4">
                <h4 class="example-title">菜单图标</h4>
                <input class="form-control" type="text" data-bind="value:Menu_Icon" placeholder="请输入菜单图标 如：fa fa-file">
            </div>

            <div class="col-sm-6 col-md-4">
                <h4 class="example-title">父级菜单</h4>
                <input class="form-control" type="text" data-bind="value:pname" disabled="disabled">
            </div>

            <div class="col-sm-12 col-md-12">
                <h4 class="example-title">菜单权限</h4>
                @foreach (var item in list)
                {
                    <div class="col-sm-3">
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" name="Function_ID" value="@item.Function_ID"> @item.Function_Name
                            </label>
                        </div>
                    </div>

                }
            </div>


        </div>

    </div>
</div>
<!--按钮-->
<div class="my-ButtonBar text-right">
    <div class="btn-group">
        <button type="button" class="btn btn-success btn-outline" data-bind="visible: !App.IsAdd()" onclick="adminForm.resetUrl(null)">新增</button>
        <button class="btn btn-primary btn-outline" onclick="App.Save()">提交</button>
        <button class="btn btn-danger btn-outline" onclick="admin.layer.close(admin.getLayerIframeIndex());">关闭</button>
    </div>
</div>
@section css{
    <link href="~/Admin/lib/icheck/skins/all.css" rel="stylesheet" />
}
@section js{
    <script src="~/Admin/lib/Ko/Knockout-3.4.2.debug.js"></script>
    <script src="~/Admin/js/admin-form.js"></script>
    <script src="~/Admin/lib/icheck/icheck.min.js"></script>
    <script type="text/javascript">
        var KeyId = '@KeyId';
        var pId = admin.getQueryString("pId");
        model = new vModel();
        $(function () {
            ko.applyBindings(model);//注册vModel
            App.Load();
        });

        var App = {
            IsAdd: function () {
                return !KeyId;
            },
            Load: function () {
                $('input[type=checkbox]').iCheck({
                    checkboxClass: 'icheckbox_flat-green',
                    radioClass: 'iradio_flat-green'
                });

                adminForm.load({
                    KeyId: KeyId,
                    url: "@Url.Action("Find")",
                    callBack: function (r) {
                        for (var i = 0; i < r.Menu_Power.length; i++) {
                            $("input[value=" + r.Menu_Power[i] + "]").iCheck('check');
                        }

                        if (pId) {
                            admin.ajax({
                                url: "@Url.Action("Find")",
                                data: { ID: pId },
                                success: function (r) {
                                    if (App.IsAdd()) {
                                        model.pname(r.Menu_Name);
                                        model.Menu_ParentID(pId);
                                    }
                                }
                            });
                        } else {
                            model.pname("一级菜单");
                        }



                    }
                });
            },
            Save: function () {
                //组装 checkbox
                var json = [];
                $.each($("input[name=Function_ID]"), function (i, e) {
                    if ($(this).prop("checked")) {
                        json.push({
                            Function_ID: $(this).val()
                        });
                    }
                });
                model.Function_ID(JSON.stringify(json));

                adminForm.Save({
                    url: "@Url.Action("Save")",
                    callBack: function (r) { }
                });
            },
            FindBack: {
                CallBack: function (row, tag, dom) {
                    //if (tag == "Role") {
                    //    model.Role_ID(row ? row.Role_ID : "");
                    //    model.Role_Name(row ? row.Role_Name : "");
                    //}
                }
            }
        };

        //Menu_ID, Menu_Num, Menu_Name, Menu_Url, Menu_Icon, Menu_ParentID, Menu_CreateTime
        function vModel() {
            this.Menu_ID = ko.observable("");
            this.Menu_Num = ko.observable("");
            this.Menu_Name = ko.observable("");
            this.Menu_Url = ko.observable("");
            this.Menu_Icon = ko.observable("");
            this.Menu_ParentID = ko.observable("");
            this.Menu_CreateTime = ko.observable("");
            this.pname = ko.observable("");

            this.Function_ID = ko.observable("");
        }
    </script>
}
